﻿<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>使用jQuery</title>
	</head>

	<body>
		<p class="a1"></p>
		<p>gwt</p>
		<!--引入jQuery，注意相对路径-->
		<script src="../jquery-1.12.4.min.js"></script>
		<!--<p>如果你点我，我就会消失。</p>
		<p>继续点我!</p>
		<p>接着点我!</p>-->
		<script>
			/* 在HTML页面中创建含有文本“测试”和属性（align=center）的<h2>元素  */
			// 1、用原生js实现
			// 1）创建h2元素节点
			var h2 = document.createElement('h2');
			// 2） 创建文本节点
			var text = document.createTextNode('测试');
			// 3）创建属性节点
			var attr = document.createAttribute('align');
			// 4）为属性节点赋值
			attr.value = 'center';
			// 5）为h2元素添加属性节点
			h2.setAttributeNode(attr);
			// 6）为h2元素添加文本节点
			h2.appendChild(text);
			// 7）为h2节点追加为Bod元素的子节点
			document.querySelector('body').appendChild(h2);		

			// 2、用jQuery实现:增加p标签
			//$(select).action()
			//$表示jquery类，selector表示html元素；action表示对元素进行的操作
			
              $('<p>哈哈哈</p>').appendTo('h2')
              //隐藏class名为a1的P标签
              //$('p').hide();
              $('p1.a1').hide();
		</script>

		
	</body>

</html>